<div th:fragment="menu">
	<div id="sidebar">
	</div>
	<script th:src="@{/js/jquery-1.11.2.min.js}"></script>
	<script type="text/javascript">
		$.ajax({cache : true,
					type : "POST",
					url : 'resources/loadMenu',
					dataType : "json",
					success : function(data) {
						var _html = '<ul >';
						$.each(data,function(i, n) {
											_html += '<li class="submenu"> <a href="#"><i class="icon"></i> <span>>>'
													+ n.name + '</span></a>';
											_html += '<ul >';
											$
													.each(
															n.childs,
															function(j, m) {
																_html += "<li><a href='"+m.resurl+"'><i class='icon '></i> <span>"
																		+ m.name
																		+ "</span></a> </li>";
															});
											_html += '</ul >';
											_html += '</li>';
										});
						_html+='</ul >';
						$('#sidebar').html(_html);
					}
				});
		function fun(arr, arr2, pid) {
			var j = 0;
			for (var i = 0; i < arr.length; i++) {
				if (arr[i].parentid == pid) {
					arr2[j] = arr[i];
					fun(arr, arr2[j], arr[i].id)
					j++;
				}
			}
		}
		$(function() {
			$("#sidebar").on("click", '.submenu', function() {
				$(this).toggleClass("open");
			})
		})
	</script>
</div>

